<!-- start: PAGE TITLE -->
<section id="page-title">
	<div class="row">
		<div class="col-sm-8">
			<h1 class="mainTitle" translate="sidebar.nav.scheduling.MINE">{{ mainTitle }}</h1>
			<span class="mainDescription" translate="sidebar.nav.scheduling.MINEDesc">A port of the bootstrap calendar widget to AngularJS (no jQuery required).</span>
		</div>
		<!-- <div ncy-breadcrumb></div> -->
	</div>
</section>
<!-- end: PAGE TITLE -->
<!-- start: CALENDAR -->
<div class="container-fluid container-fullw bg-white">
	<div class="row">
		<div class="col-md-12">
			<!-- /// controller:  'myCalendarCtrl' -  localtion: assets/js/controllers//mycalendarCtrl.js /// -->
			<div ng-controller="myCalendarCtrl" id="demo">
				<!--div class="row">
					<div class="col-md-12">
						<div class="margin-bottom-30">
							<button class="btn btn-primary btn-o btn-wide" ng-click="addEvent()">
								<i class="ti-plus"></i> Add new event
							</button>
						</div>
					</div>
				</div-->
				<div class="row">
					<!-- <div class="col-md-12"> -->
						<!-- <div class="col-md-12">
						<h2 class="text-center margin-bottom-20 margin-top-20">{{ calendarTitle }} </h2>
					</div> -->
						<!-- <h2 class="text-center margin-bottom-20 margin-top-20">{{ calendarControl.getTitle() }} </h2> -->
					<!-- </div> -->
					<div class="col-xs-8">
						<div class="btn-group col-md-2">
							<button class="btn btn-primary" mwl-date-modifier date="calendarDate" decrement="calendarView">
								<i class="ti-angle-left"></i>
							</button>
							<button class="btn btn-primary" mwl-date-modifier date="calendarDate" increment="calendarView">
								<i class="ti-angle-right"></i>
							</button>
						</div>
						<button class="btn btn-primary btn-o col-md-2" mwl-date-modifier date="calendarDate" set-to-today>
							<span translate="calendar.TODAY">TODAY</span>
						</button>
						<h2 class="form-group col-md-2 " style="font-weight:bold">{{ calendarTitle }} </h2>
					</div>
					<div class="col-xs-4 text-left">
						<div class="visible-md visible-lg hidden-sm hidden-xs">
							<div class="btn-group">
								<!-- <label class="btn btn-primary" ng-model="calendarView" btn-radio="'year'">
									<span translate="calendar.YEAR">Year</span>
								</label> -->
								<label class="btn btn-primary" ng-model="calendarView" btn-radio="'month'">
									<span translate="calendar.MONTH">Month</span>
								</label>
								<label class="btn btn-primary" ng-model="calendarView" btn-radio="'week'">
									<span translate="calendar.WEEK">Week</span>
								</label>
								<!-- <label class="btn btn-primary" ng-model="calendarView" btn-radio="'day'">
									<span translate="calendar.DAY">Day</span>
								</label> -->
							</div>
						</div>
						<div class="visible-xs visible-sm hidden-md hidden-lg">
							<div class="btn-group" dropdown>
								<button type="button" class="btn btn-primary dropdown-toggle" dropdown-toggle>
									<i class="fa fa-cog"></i>&nbsp;<span class="caret"></span>
								</button>
								<ul class="dropdown-menu pull-right dropdown-light" role="menu">
									<li>
										<a ng-model="calendarView" btn-radio="'year'" href="">
											Year
										</a>
									</li>
									<li>
										<a ng-model="calendarView" btn-radio="'month'" href="">
											Month
										</a>
									</li>
									<li>
										<a ng-model="calendarView" btn-radio="'week'" href="">
											Week
										</a>
									</li>
									<li>
										<a ng-model="calendarView" btn-radio="'day'" href="">
											Day
										</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
				<br>
				<mwl-calendar
				    view="calendarView"
				    view-date="calendarDate"
				    events="events"
				    view-title="calendarTitle"
				    on-event-click="eventClicked(calendarEvent)"
				    on-event-times-changed="calendarEvent.startsAt = calendarNewEventStart; calendarEvent.endsAt = calendarNewEventEnd"
				    edit-event-html="'<i class=\'glyphicon glyphicon-pencil\'></i>'"
				    delete-event-html="'<i class=\'glyphicon glyphicon-remove\'></i>'"
				    on-edit-event-click="eventEdited(calendarEvent)"
				    on-delete-event-click="eventDeleted(calendarEvent)"
				    calendar-time-label="时间"
					calendar-event-label="描述"
				    cell-is-open="false">
				</mwl-calendar>
				<!-- <mwl-calendar
				calendar-events="events"
				calendar-view="calendarView"
				calendar-current-day="calendarDay"
				calendar-control="calendarControl"
				calendar-event-click="eventClicked($event)"
				calendar-edit-event-html="'<div class=\'btn btn-primary btn-sm pull-left\'><i class=\'ti-pencil\'></i></div>'"
				calendar-delete-event-html="'<div class=\'btn btn-danger btn-sm margin-left-10 pull-left\'><i class=\'ti-close\'></i></div>'"
				calendar-time-label="时间"
				calendar-event-label="描述"
				calendar-week-title-label="{year}年{week}周"
				calendar-edit-event-click="eventEdited($event)"
				calendar-auto-open="false"
				></mwl-calendar> -->
				<br>
				<br>
				<!-- calendar-delete-event-click="eventDeleted($event)" -->
				<br>
				<!-- start: EDIT EVENT TEMPLATE -->
				<script type="text/ng-template" id="scheduleEvent.html">
					<div class="modal-body">
					 
					<div class="form-group">
					<label>
					开始
					</label>
					<span class="input-icon">
					<input type="text" class="form-control underline"
				           datepicker-popup="yyyy-MM-dd HH:mm:ss" ng-disabled="'disabled'"
				           ng-model="event.starts_at" is-open="false"
				           close-text="关闭" current-text="今天" clear-text="清空" />
				    <i class="ti-calendar"></i>
					</span>
					</div>
					<label>
					
					<div class="form-group">
					<label>
					结束
					</label>

					<span class="input-icon">
					<input type="text" class="form-control underline"
				           datepicker-popup="yyyy-MM-dd HH:mm:ss" ng-disabled="'disabled'"
				           ng-model="event.ends_at" is-open="false"
				           close-text="关闭" current-text="今天" clear-text="清空" />
				    <i class="ti-calendar"></i>
					</span>
					</div>
					<div class="form-group">
					<label>
					值班类型
					</label>
					<div class="row">
					<div class="col-xs-6">
					  
					<label for="job">
					  {{scheduleClassic[event.type].name}}
					</label>
					</div>
					</div>
					</div>
					</div>
					</div>
					</div>
					 
					<div class="modal-footer">
					 
					<button class="btn btn-primary btn-o" ng-click="cancel()">
					关闭
					</button>
					</div>
				</script>
				<!-- end: EDIT EVENT TEMPLATE -->
			</div>
		</div>
	</div>
</div>
<!-- end: CALENDAR -->
